<style lang="scss">
  @import 'index';
</style>

<template>
  <div class="ga-container">
    <div class="ga-order-detail">
      <!--地址不为空-->
      <div class="address">
        <p class="tit mr10">收货地址:</p>
        <div>
          <p class="p1">
            <span class="mr10">{{detail.consignee}}</span>
            <span class="mr10">{{detail.mobile}}</span>
            <!-- <span class="mark">家</span> -->
          </p>
          <p class="p2">{{detail.province}}{{detail.city}}{{detail.district}}{{detail.address}}</p>
        </div>
      </div>

      <!--商品列表-->
      <ul class="ga-group-list ga-media-list">
        <li v-for="(item,index) in detail._order_goods" :key="index">
          <a class="item" href="#">
            <div class="item-media">
              <div class="img-box">
                <img :src="item.icon" alt="">
              </div>
            </div>
            <div class="item-inner">
              <p class="title">{{item.goods_name}}</p>
              <!-- <p class="p1">{{item.goods_attr ? item.goods_attr : ''}}</p> -->
              <div class="con">
                <span>{{item.goods_attr ? item.goods_attr : ' '}}</span>
                <div>
                  <span>x{{item.goods_number}}</span>
                  <span class="price">¥{{item.goods_price}}</span>
                </div>
              </div>
            </div>
          </a>
        </li>
      </ul>

      <ul class="ga-cell mt10 product-price">
        <li class="item">
          <span>商品总价</span>
          <span class="span2">¥{{detail.goods_amount}}</span>
        </li>
        <li class="item">
          <span>优惠金额</span>
          <span class="span2">¥{{detail.discount}}</span>
        </li>
        <li class="item">
          <span>配送费</span>
          <span class="span2">¥{{detail.shipping_price}}</span>
        </li>
        <li class="item mt20">
          <span>实付金额</span>
          <span class="span2">¥{{detail.order_amount}}</span>
        </li>
      </ul>

      <!--订单信息-->
      <div class="order-msg">
        <p>订单编号：{{detail.order_sn}}</p>
        <p>下单时间：{{detail.add_time}}</p>
        <p>支付状态：{{detail.pay_status==1 ? '已支付' : '未支付'}}</p>
        <p v-if="detail.pay_status == 1">支付方式：{{detail.pay_name}}</p>
        
      </div>
      <!--订单信息-->
      <!-- <div class="order-msg" v-if="detail.pay_status == 1"> -->
        <div class="order-msg" v-if="detail.shipping_status == 1">
          <h3>物流信息：<span @click="shuaxin" :style="{'background':'red','color':'#fff','padding':'0 5px'}">刷新</span></h3>
        <p v-for="(item,index) in shiping.data" :key="index">{{item.time}}:{{item.context}}</p>
        
        
      </div>
    </div>
  </div>
</template>

<script>
import {isLogin,handleError,showToast} from '@/utils/handleLogin'
export default {

  data () {
    return {
       detail:{},
       shiping: []
    }
  },
  methods: {
    async load () {
      let params = {
         id: this.$root.$mp.query.id
      }
      this.$_util.ajax.post('https://guo-a.com/mapi/order/detail?token=' + this.$store.state.Token,params).then((res) => {
         if(res.code === 200){
            this.detail = res.data
            if(res.data.shipping_status == 1){
               this.shuaxin()
            }
         }
      })
    },
    async shuaxin () {
      let params = {
         id: this.$root.$mp.query.id
      }
      this.$_util.ajax.post('https://guo-a.com/mapi/order/order_shipping?token=' + this.$store.state.Token,params).then((res) => {
        console.log(res)
        if(res.code === 200){
           this.shiping = res.data
        }
       })
    }
  },
  created () {

  },
  onShow () {
     isLogin(()=>{
      if(!this.$root.$mp.query.hasOwnProperty('id')){
          wx.navigateBack()
          return false
      }
      this.detail = {}
      this.load()
     })
  },
  mounted () {

  }
}
</script>
